<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title>Football Fever - Worldcup 2010</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <script type="text/javascript" src="static/data.js"></script>
  <script type="text/javascript" src="http://football-fever.appspot.com/getmatches"></script>
  <script type="text/javascript" src="http://football-fever.appspot.com/getprediction"></script>
  <script type="text/javascript" src="static/index.js"></script>
  <link type="text/css" href="static/landing.css" rel="stylesheet" />
</head>

<body onload="init()">
  <!--
  <div id="content">
    <div id="pagination">
      <a id="left-nav" href="javascript:goTo(-1)"></a>
      <a id="right-nav" href="javascript:goTo(1)"></a>
      Football World Cup 2010
    </div>

    <div id="main-content"></div>
  </div>
  -->
  <div id="main-content"></div>
  <textarea id="tpl-group" style="display:none;">
    <table cellspacing="0" cellpadding="0" border="0" class="group-table">
      <tr>
        <td class="group-header">{groupName}</td>
      </tr>
      <tr>
        <td>{matches}</td>
      </tr>
    </table>
  </textarea>

  <textarea id="tpl-one-match" style="display: none;">
    <table cellspacing="0" cellpadding="0" border="0" width="100%" class="match-table">
      <tr>
        <td class="team team1">
          {flag1} &nbsp;&nbsp;<span>{team1}</span>
        </td>
        <td width="*" class="match-time">
          <span style="display:{dateStyle};">
            <a class="calendar-link fifa-score" onclick="addToCalendar({matchNumber})" href="javascript:void(0)">
            {time}, {dateLocaleFormat}
            </a>
          </span>
          <span style="display:{scoreStyle};">{team1Score} - {team2Score}</span>
        </td>
        <td class="team team2">
          <span>{team2}</span>&nbsp;&nbsp;{flag2}
        </td>
        <td class="betting-btn-cell">
          <a class="betting-btn" onclick="waveThis({matchNumber}, 'betting')" href="javascript:void(0)">
            Predict this match
          </a>
        </td>
        <td class="party-btn-cell">
          <a class="party-btn" onclick="waveThis({matchNumber}, 'party')" href="javascript:void(0)">
            Plan a party
          </a>
        </td>
        <td id="statistic-{matchNumber}" class="statistic">
        </td>
      </tr>
    </table>

    <form target="_blank" id="wave-this-{matchNumber}" method="GET"
        action="https://wave.google.com/wave/wavethis">
      <input type="hidden" name="t" id="title-{matchNumber}"
          value="Match Wave: {team1} vs {team2}" />
      <input type="hidden" name="u" id="url-reference-{matchNumber}"
          value="http://football-fever.appspot.com/index.html?match={matchNumber}&team1={team1}&team2={team2}&location={location}&matchDate={matchDate}" />
      <input type="hidden" name="c" value="" />
      <input type="hidden" name="r" value="football-fever@appspot.com" />
      <input type="hidden" name="g" value="http://football-fever.appspot.com/static/loading.xml" />
    </form>
    <form target="_blank" id="calender-{matchNumber}" method="GET"
        action="http://www.google.com/calendar/event">
      <input type="hidden" name="action" value="TEMPLATE"/>
      <input type="hidden" name="text" value="Match Wave: {team1} vs {team2}"/>
      <input type="hidden" name="dates" value="{duration}"/>
      <input type="hidden" name="location" value="{location}"/>
      <input type="hidden" name="details" value=""/>
    </form>
  </textarea>

  <textarea id="tpl-one-prediction" style="display:none;">
    <table width="100%" cellspacing="0" cellpadding="0" border="0">
      <tr>
        <td width="40px">{team1Flag}</td>
        <td><img src="images/graph_bar.png" style="height:12px; width:{team1Width}px;" title="{team1} total picks"/></td>
      </tr>
      <tr>
        <td>{team2Flag}</td>
        <td><img src="images/graph_bar.png" style="height:12px; width:{team2Width}px;" title="{team2} total picks"/></td>
      </tr>
      <tr>
        <td>Draw</td>
        <td><img src="images/graph_bar.png" style="height:12px; width:{drawWidth}px;" title="{draw} total picks"/></td>
      </tr>
    </table>
  </textarea>






<textarea id="tpl-match" style="display: none;">
  <form target="_blank" id="wave-this-{matchNumber}" method="GET"
      action="https://wave.google.com/wave/wavethis">
    <input type="hidden" name="t" id="title-{matchNumber}"
        value="Match Wave: {team1} vs {team2}" />
    <input type="hidden" name="u" id="url-reference-{matchNumber}"
        value="http://football-fever.appspot.com/index.html?match={matchNumber}&team1={team1}&team2={team2}" />
    <input type="hidden" name="c" value="" />
    <input type="hidden" name="r" value="football-fever@appspot.com" />
    <input type="hidden" name="g" value="http://football-fever.appspot.com/static/loading.xml" />
  </form>
  <form target="_blank" id="calender-{matchNumber}" method="GET"
      action="http://www.google.com/calendar/event">
    <input type="hidden" name="action" value="TEMPLATE"/>
    <input type="hidden" name="text" value="Match Wave: {team1} vs {team2}"/>
    <input type="hidden" name="dates" value="{duration}"/>
    <input type="hidden" name="location" value="{location}"/>
    <input type="hidden" name="details" value=""/>
  </form>
  <table width="100%" cellspacing="0" cellpadding="0" border="0">
    <tr>
      <td class="match-table-date dot-line-bottom" align="left">
        Group {group}
      </td>
      <td class="match-table-head dot-line-bottom" colspan="2" align="right">
        {venue}
      </td>
      <td rowspan="2" width="64px" class="betting-btn-cell">
        <a class="betting-btn" onclick="waveThis({matchNumber}, 'betting')" href="javascript:void(0)">
          Betting
        </a>
      </td>
      <td rowspan="2" width="103px" class="party-btn-cell">
        <a class="party-btn" onclick="waveThis({matchNumber}, 'party')" href="javascript:void(0)">
          Party planning
        </a>
      </td>
    </tr>
    <tr>
      <td width="29%" class="match-table-home-score" valign="bottom" align="left">
        {flag1} &nbsp;&nbsp;<span>{team1}</span>
      </td>
      <td width="*" class="match-table-home-team" valign="bottom" align="center">
        <a class="calendar-link fifa-score" onclick="addToCalendar({matchNumber})" href="javascript:void(0)" style="display:{dateStyle};">
        {time}, {dateLocaleFormat}
        </a>
        <span style="display:{scoreStyle};">{team1Score} - {team2Score}</span>
      </td>
      <td width="29%" class="match-table-away-score" valign="bottom" align="right">
        <span>{team2}</span>&nbsp;&nbsp;{flag2}
      </td>
    </tr>
  </table>
</textarea>
</body>
</html>
